/* 
    封装 axios 的文件
*/

// 导入 axios
import axios from 'axios'
// 导入 qs
import qs from 'qs'
// 导入 element-plus 的 message 模块
import { ElMessage } from 'element-plus'
// 导入项目配置文件
import config from '../config/index' // 引入配置文件


//1. 创建新的axios实例，
const service = axios.create({
    // 请求默认地址
    baseURL: config.baseURL,
    // 超时时间 单位是ms，这里设置了3s的超时时间
    timeout: 5 * 1000,
})


// 2.设置跨域是否允许携带凭证(cookie....)
service.defaults.withCredentials = false


// 3.请求拦截器
service.interceptors.request.use(config => {
    // 声明并设置以 x-www-form-urlencoded 的格式传递数据
    config.headers['Content-Type'] = 'application/x-www-form-urlencoded'
    config.data = qs.stringify(config.data)

    // 声明并设置以 json 的格式传递数据
    // config.headers['Content-Type'] = 'application/json'
    // config.data = JSON.stringify(config.data);

    //如有需要：注意使用token的时候需要引入cookie方法或者用本地localStorage等方法，推荐js-cookie
    const token = localStorage.getItem('token'); //这里取token之前，你肯定需要先拿到token,存一下
    if(token){
        config.headers.Authorization = token; //如果要求携带在请求头中
        //config.headers.token= token; //如果要求携带在请求头中
    }

    return config
}, error => {
    return Promise.reject(error)
})


// 4.响应拦截器
service.interceptors.response.use(response => {
//接收到响应数据并成功后的返回响应主体
    return response.data
}, error => {
/***** 接收到异常响应的处理开始 *****/
    const { response } = error

    if (response) { // 有返回结果
        // 1.公共错误处理
        // 2.根据响应码具体处理
        switch (response.status) {
            case 400:
                error.message = '错误请求'
                break;
            case 401:
                error.message = '未授权，请重新登录'
                break;
            case 403:
                error.message = '服务器拒绝访问'
                break;
            case 404:
                error.message = '请求错误,未找到该资源'
                break;
            case 405:
                error.message = '请求方法未允许'
                break;
            case 408:
                error.message = '请求超时'
                break;
            case 412:
                error.message = '请求参数错误：'+response.data.message
                break;
            case 413:
                error.message = '请求的实体过大'
            case 500:
                error.message = '服务器端出现错误'
                break;
            case 505:
                error.message = '不支持http协议请求'
                break;
            default:
                error.message = `连接错误${error.response.status}`
            }
    } else { // 无返回结果
        if(!window.navigator.onLine){ // 断网处理
            error.message = '网络连接失败'
        }else if (JSON.stringify(error).includes('timeout')) { // 超时处理
            error.message = '连接超时，请刷新'
        }else{ // 同一错误处理
            error.message = '连接服务器失败'
        }
    }

    // 统一输出错误消息
    ElMessage.error(error.message)

    /***** 处理结束 *****/
    //如果不需要错误处理，以上的处理过程都可省略
    return Promise.reject(error)
})

//5.导出文件
export default service
